<template>
  <div class="product">
    <!-- 搜索框 -->
    <div class="search">
      <template>
        <el-select
          v-model="value"
          multiple
          filterable
          remote
          reserve-keyword
          placeholder="请输入姓名,如果不更新,点击右侧搜索按钮"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </template>

      <el-button type="primary" icon="el-icon-search" plain></el-button>

      <el-button type="primary">添加项目</el-button>
    </div>
    <!-- 班级选择 -->
    <div class="select-class">
      <el-form>
        <el-form-item label="选择班级:">
          <el-select v-model="select" placeholder="请选择">
            <el-option label="餐厅名" value="1"></el-option>
            <el-option label="订单号" value="2"></el-option>
            <el-option label="用户电话" value="3"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格 -->
    <div class="stu-table">
      <el-table style="width: 100%">
        <el-table-column
          prop="headimgurl"
          align="center"
          label="头像"
          width="100"
        >
        </el-table-column>
        <el-table-column prop="name" align="center" width="120" label="姓名">
        </el-table-column>
        <el-table-column prop="degree" align="center" label="学历">
        </el-table-column>
        <el-table-column prop="class" align="center" label="班级">
        </el-table-column>
        <el-table-column prop="productUrl" align="center" label="项目">
        </el-table-column>
        <el-table-column prop="cTime" align="center" label="创建时间">
        </el-table-column>
        <el-table-column align="center" label="操作"> </el-table-column>
        <template>
          <el-button type="primary" class="btn" icon="el-icon-view"
            >查看</el-button
          >
          <el-button type="primary" class="btn" icon="el-icon-edit"
            >编辑</el-button
          >
          <el-button type="danger" class="btn" icon="el-icon-delete"
            >删除</el-button
          >
        </template>
      </el-table>
    </div>
  </div>
</template>
<script>
import * as api from "@/api/users";
import { mapState, mapActions, mapMutations } from "vuex";
export default {
  computed:{
    ...mapState(["stuData","loading","stuTotal","stuPageSize"])
  },
  data() {
    return {
      params: {
        class: "",
        count: 5,
      },
      input1: "",
      input2: "",
      input3: "",
      select: "",
      options: [],
      value: [],
    };
  },
  created(){
    // this.GET_STULIST();
  },
  methode:{
    ...mapActions(["GET_STULIST"]),
    ...mapMutations([
				"SHOW_DIALOG",
				"CHANGE_DIALOG_TITLE",
				"SET_CURRENT_ROW",
				"SET_STU_DATA",
			]),
  },
  meta: {
    title: "xyxmgl",
    icon: "iconfont icon-shangpinguanli",
  },
};
</script>
<style scoped lang="less">
.search {
  line-height: 60px;
  text-align: left;
  margin: 20px 0;
  /deep/ .el-input__inner {
    width: 300px;
  }
}

.select-class {
  line-height: 40px;
  text-align: left;
  margin-bottom: 20px;
}
.stu-table .btn {
  width: 65px;
  height: 25px;
  padding: 0;
}
.pagination {
  margin-top: 20px;
}
/deep/ .exportExcel i.icon-excel {
  color: green;
  font-size: 20px;
  margin-right: 3px;
}

.exportExcel .el-button {
  padding: 4px 7px;
  float: right;
}
.exportExcel {
  margin-bottom: 10px;
  overflow: hidden;
}
</style>